<template>
	<view class="main">
		<view class="top-box">
      <view class="title-box">
        <url-image src="/static/images/member/earnings/left.png" mode="widthFix" width="16" height="31" class="back-btn" @click="back()"></url-image>
        <view class="title">我的收益</view>
      </view>
      <view @click="$navigateTo('/pagesEarnings/balance/detail')">
        <view class="miney">{{balance|formatMoney}}</view>
        <view class="tip">可用余额(元)</view>
      </view>
      <view class="tx-btn" @click="getWithdrawType">提现</view>
    </view>
    <view class="sy-box">
      <view class="title-box" @click="$navigateTo('/pagesEarnings/retail/detail?queryType='+'ALL')">
        <view class="left">
          <url-image src="/static/images/member/earnings/v1.png" width="24" height="20"></url-image>
          <text class="totoal">零售累计收益  {{retail.amount}}</text>
        </view>
        <view class="right">
          <text class="name">查看明细</text>
          <url-image src="/static/images/member/earnings/right.png" width="12" height="22"></url-image>
        </view>
      </view>
      <view class="price-content">
        <view class="price-box" @click="$navigateTo('/pagesEarnings/retail/issued')">
          <view class="num">{{retail.sentAmount}}</view>
          <view class="name">
            累计已发放
          </view>
        </view>
        <view class="price-box" @click="$navigateTo('/pagesEarnings/retail/detail?queryType='+'UNSEND')">
          <view class="num">{{retail.unsendAmount}}</view>
          <view class="name">
            <text>累计未发放</text>
            <url-image src="/static/images/member/earnings/question.png" width="26" height="26" class="question"></url-image>
          </view>
        </view>
        <view class="price-box" @click="$navigateTo('/pagesEarnings/retail/detail?queryType='+'MONTH')">
           <view class="num">{{retail.estimatedAmount}}</view>
           <view class="name">
             本月预估收益
             <url-image src="/static/images/member/earnings/question.png" width="26" height="26" class="question"></url-image>
           </view>
        </view>
      </view>
     </view>
     <view class="sy-box" >
       <view class="title-box" @click="$navigateTo('/pagesEarnings/bhs/settleDetails?queryEnum='+'ALL')">
         <view class="left">
           <url-image src="/static/images/member/earnings/v2.png" width="24" height="20"></url-image>
           <text class="totoal">碧划算累计收益  {{bhs.amount}}</text>
         </view>
         <view class="right">
           <text class="name">查看明细</text>
           <url-image src="/static/images/member/earnings/right.png" width="12" height="22"></url-image>
         </view>
       </view>
       <view class="price-content">
         <view class="price-box" @click="$navigateTo('/pagesEarnings/bhs/issued')">
           <view class="num">{{bhs.sentAmount}}</view>
           <view class="name">
             累计已发放
           </view>
         </view>
         <view class="price-box" @click="$navigateTo('/pagesEarnings/bhs/settleDetails?queryEnum='+'UNSETTLE')">
           <view class="num">{{bhs.unsendAmount}}</view>
           <view class="name">
             <text>累计未发放</text>
             <url-image src="/static/images/member/earnings/question.png" width="26" height="26" class="question"></url-image>
           </view>
         </view>
         <view class="price-box" @click="$navigateTo('/pagesEarnings/bhs/settleDetails?queryEnum='+'MONTH')">
            <view class="num">{{bhs.estimatedAmount}}</view>
            <view class="name">
              本月预估收益
              <url-image src="/static/images/member/earnings/question.png" width="26" height="26" class="question"></url-image>
            </view>
         </view>
       </view>
      </view>
      <view class="sy-box">
        <view class="title-box" @click="$navigateTo('/pagesEarnings/box/income')">
          <view class="left">
            <url-image src="/static/images/member/earnings/v3.png" width="24" height="20"></url-image>
            <text class="totoal">箱起累计收益积分  {{box.all_integral}}</text>
          </view>
          <view class="right">
            <text class="name">查看明细</text>
            <url-image src="/static/images/member/earnings/right.png" width="12" height="22"></url-image>
          </view>
        </view>
        <view class="price-content">
          <view class="price-box" @click="$navigateTo('/pagesEarnings/box/integralDetail')">
            <view class="num">{{box.use_integral}}</view>
            <view class="name">
              可用积分
            </view>
          </view>
          <view class="price-box" @click="$navigateTo('/pagesEarnings/box/writeOff')">
            <view class="num">{{box.total_write_off}}</view>
            <view class="name">
              <text>累计核销积分</text>
              <url-image src="/static/images/member/earnings/question.png" width="26" height="26" class="question"></url-image>
            </view>
          </view>
          <view class="price-box" @click="$navigateTo('/pagesEarnings/box/monthIncome')">
             <view class="num">{{box.month_integral}}</view>
             <view class="name">
               本月收益积分
               <url-image src="/static/images/member/earnings/question.png" width="26" height="26" class="question"></url-image>
             </view>
          </view>
        </view>
       </view>
	</view>
</template>

<script>
  import { toBackPage } from '@/utils/navigateTo'
  import { inApp } from '@/utils/tools'
	export default {
		data() {
			return {
        balance:0,//余额
        //零售
        retail:{},
        //碧划算
        bhs:{},
        //箱起
        box:{}
			}
		},
    onShow() {
      this.app_interactive_data();
    },
    onPullDownRefresh() {
      this.app_interactive_data();
    },
		methods: {
      async app_interactive_data(){
        //余额
        this.$api.gainApi.available_amount({userId:this.userInfo.uid}).then(res=>{
          this.balance=res.data;
        });
        //零售累计
        this.$api.gainApi.retail_cumulative({userId:this.userInfo.uid}).then(res=>{
          this.retail=res.data;
        });
        //碧划算累计
        this.$api.gainApi.bhs_cumulative({userId:this.userInfo.uid}).then(res=>{
          this.bhs=res.data;
        });
        //箱起累计收益
        this.$api.gainApi.box_cumulative({userId:this.userInfo.uid}).then(res=>{
          this.box=res.data;
        });
        setTimeout(function() {
          uni.stopPullDownRefresh()
        }, 500)
      },
			back(){
        toBackPage();
      },
      //去提现
      async getWithdrawType() {
        const bihsData = await this.$api.commissionApi.getWithdrawInfo({ userId: this.$store.state.userInfo.uid })
        if (bihsData.code === '000000') {
          const type = bihsData.data.withdrawRule.withdrawChannel
          if (type === 'alipay') {
            this.$navigateTo('/pagesCommission/bihs/withdraw?type=' + type)
          } else {
            if (bihsData.data.userBankCard && Number(bihsData.data.userBankCard.status) === 3) {
              this.$navigateTo('/pagesCommission/bihs/withdraw?type=gongmall')
            } else {
              if (inApp()) {
                this.$gc.$message({
                  content: '您还未进行实名认证，请前往个人中心实名认证！',
                  title: '提示',
                  type: 'richText',
                  showMessage: true,
                  showCancel: false,
                  align: 'center',
                  confirmText: '好哒'
                })
              } else {
                this.$gc.$message({
                  content: '您还未进行实名认证，只有实名认证的用户才可以发起提现',
                  title: '提示',
                  type: 'richText',
                  showMessage: true,
                  showCancel: true,
                  confirmText: '去实名',
                  align: 'center',
                  confirm: () => {
                    uni.removeStorageSync('realName')
                    this.$navigateTo('/pagesMine/certification/index')
                  }
                })
              }
            }
          }
        }
      },
		}
	}
</script>

<style lang="scss" scoped>
.main{
  padding-bottom: 1rpx;
}
.top-box{
  background: url('https://asset-uat.bisinuolan.cn/bixuan_uni/static/images/member/earnings/top-back.png') no-repeat;
  width: 100%;
  height: 494rpx;
  background-size: 100% auto;
  text-align: center;
  font-family: PingFang SC;
  .title-box{
    /* #ifdef H5 */
    padding-top: 34rpx;
    /* #endif*/
    /* #ifndef H5 */
    padding-top: 66rpx;
    /* #endif*/
    position: relative;
    text-align: center;
    color: white;
    font-size: 34rpx;
    .back-btn{
      position: absolute;
      left: 20rpx;
      margin-top: 10rpx;
    }
  }
  .miney{
    margin-top: 46rpx;
    font-size: 82rpx;
    font-weight: 400;
    color: #FFFFFF;
  }
  .tip{
    color: #FFFFFF;
    opacity: 0.69;
    font-size: 24rpx;
    margin-top: 33rpx;
  }
  .tx-btn{
    width: 302rpx;
    height: 80rpx;
    line-height: 70rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.9;
    border: 2rpx solid #bebebe;
    border-radius: 10rpx;
    margin: 42rpx auto 0rpx;
    font-size: 30rpx;
    color: white;
  }
}
.sy-box{
  background-color: white;
  border-radius: 5rpx;
  margin: 19rpx 10rpx;
  .title-box{
    display: flex;
    justify-content: space-between;
    padding: 46rpx 32rpx 0rpx;
    .left{
      .totoal{
        margin-left: 10rpx;
      }
    }
    .right{
      color: #666666;
      .name{
        margin-right: 24rpx;
      }
    }
  }
  .price-content{
    display: flex;
    padding: 100rpx 0rpx 56rpx;
    .price-box{
      flex: 1;
      text-align: center;
      .num{
        font-size: 32rpx;
        margin-bottom: 12rpx;
      }
      .name{
        font-size: 24rpx;
        color: #666666;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .question{
        margin-left: 10rpx;
      }
    }
  }
}
</style>
